<template>
    <div class="confine bg-white mt-3 pt-2 text-drak">
      <!-- 倒计时 -->
        <div class="confine-title d-flex ai-center jc-between px-2">
         <span class="fs-xxl text-pink">限时秒杀</span>
         <CountDown class="text-drak fs-xl" :current-time="currentTime" :start-time="startTime" :end-time="endTime" v-on:start_callback="countDownS_cb(3)" v-on:end_callback="countDownE_cb(3)"
         :tip-text="'距离开始'" :tip-text-end="'距离结束'" :end-text="'结束啦～'"
         :dayTxt="'天'"
         :hourTxt="':'"
         :minutesTxt="':'"
         :secondsTxt="''"
         ></CountDown>
        </div>

        <!-- 内容产品 -->
        <div class="product">
          <productList>
          <div class="d-flex">
            <div v-for="o in 10" class="px-2">
             <el-image
             style="width: 150px; height: 150px"
             :src="url"
             fit="cover">
           </el-image>
           <div>

            <div style="text-align: center; text-decoration: blink">
              <div>
                <span class="fs-xl">名称</span>
              </div>
              <div>
                <span class="text-pink fs-lg">￥1</span>
              </div>
               <div class="pb-2">
                <span style="text-decoration: line-through">￥25</span>
              </div>

            </div>
          </div>
        </div>
          </div>
           
      </productList>
    </div>

    </div>
</template>

<script>
import productList from "../public/product-list";
import CountDown from 'vue2-countdown'
  export default {

    components: {
      CountDown,
      productList
    },
    data(){
      return {
        callBk:'',
        startTime:( new Date('2020/09/05 20:10:10') ).getTime(),//剩余开始时间
        endTime:( new Date('2020/09/15 20:10:10') ).getTime(),
        currentTime: ( new Date() ).getTime(),
        url: '',
      }
      
    },
    methods:{
      countDownS_cb:function(a){
        console.log('callBack--'+a+'--开始倒计时结束回调');
      },
      countDownE_cb:function(a){
        console.log('callBack--'+a+'--活动剩余倒计时结束回调');
      }
    },

  created() {

  }
};
</script>

<style lang="scss" scoped>
.confine {

}
</style>


